<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>购物车</title>
    <link rel="stylesheet" href="__STATIC__/shopCar/bootstarp/css/bootstrap.min.css" />
    <link rel="stylesheet" href="__STATIC__/shopCar/fontAwesome/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="__STATIC__/shopCar/css/index.css" />
    <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700' rel='stylesheet' type='text/css'>
    <link href="__HOME__/css/style.css" rel="stylesheet" type="text/css" media="all" />
    <script type="text/javascript" src="__HOME__/js/jquery.min.js"></script>
    <!-- start slider -->
    <link href="__HOME__/css/slider.css" rel="stylesheet" type="text/css" media="all" />
    <script type="text/javascript" src="__HOME__/js/modernizr.custom.28468.js"></script>
    <script type="text/javascript" src="__HOME__/js/jquery.cslider.js"></script>
    <script type="text/javascript">
        $(function() {
            $('#da-slider').cslider();
        });
    </script>
    <!-- Owl Carousel Assets -->
    <link href="__HOME__/css/owl.carousel.css" rel="stylesheet">
    <!-- Owl Carousel Assets -->
    <!-- Prettify -->
    <script src="__HOME__/js/owl.carousel.js"></script>
    <script>
        $(document).ready(function() {

            $("#owl-demo").owlCarousel({
                items : 4,
                lazyLoad : true,
                autoPlay : true,
                navigation : true,
                navigationText : ["",""],
                rewindNav : false,
                scrollPerPage : false,
                pagination : false,
                paginationNumbers: false,
            });

        });
    </script>
    <!-- //Owl Carousel Assets -->
    <!-- start top_js_button -->
    <script type="text/javascript" src="__HOME__/js/move-top.js"></script>
    <script type="text/javascript" src="__HOME__/js/easing.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function($) {
            $(".scroll").click(function(event){
                event.preventDefault();
                $('html,body').animate({scrollTop:$(this.hash).offset().top},1200);
            });
        });
    </script>
</head>
<body>
<div class="header_bg">
    <div class="wrap">
        <div class="header">
            <div class="logo">
                <a href="index.html"><img src="__HOME__/images/logo.png" alt=""/> </a>
            </div>
            <div class="h_icon">
                <ul class="icon1 sub-icon1">
                    <li><a class="active-icon c1" href="#"><i>￥{:getUserBalance()|0}</i></a>
                        <ul class="sub-icon1 list">
                            <li><h3></h3><a href=""></a></li>
                            <li>
                                <a style="color: #38fefc;float: left" href="/index/shopCar">购物车</a>
                                <a  style="color: #38fefc ;float: right" href="/order/index">我的订单</a>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
            <div class="h_search">
                <form id="search" action="/index/search" method="get">
                    <input type="text" name="search" value="" placeholder="请输入商品名~">
                    <input type="submit" value="">
                </form>
            </div>
            <div class="clear"></div>
        </div>
    </div>
</div>
<div class="header_btm">
    <div class="wrap">
        <div class="header_sub">
            <div class="h_menu">
                <ul>
                    <li class="active"><a href="{:url('index')}">首页</a></li> |
                    {notempty name='category_list'}
                    {volist name='category_list' id='vo'}
                    <li><a href="{:url('index/category',['cate'=>$vo.id])}">{$vo.name}</a></li> |
                    {/volist}
                    {/notempty}
                </ul>
            </div>
            <div class="top-nav">
                <nav class="nav">
                    <a href="#" id="w3-menu-trigger"> </a>
                    <ul class="nav-list" style="">
                        <li class="nav-item"><a class="active" href="index.html">Home</a></li>
                        <li class="nav-item"><a href="sale.html">Sale</a></li>
                        <li class="nav-item"><a href="handbags.html">Handbags</a></li>
                        <li class="nav-item"><a href="accessories.html">Accessories</a></li>
                        <li class="nav-item"><a href="shoes.html">Shoes</a></li>
                        <li class="nav-item"><a href="service.html">Services</a></li>
                        <li class="nav-item"><a href="contact.html">Contact</a></li>
                    </ul>
                </nav>
                <div class="search_box">
                    <form>
                        <input type="text" value="Search" onfocus="this.value = '';" onblur="if (this.value == '') {this.value = 'Search';}"><input type="submit" value="">
                    </form>
                </div>
                <div class="clear"> </div>
                <script src="__HOME__/js/responsive.menu.js"></script>
            </div>
            <div class="clear"></div>
        </div>
    </div>
</div>
<div id="content">


    <!--购物车-->


    <!--bootstarp table 样式-->
    <div class="container shopCar">
        <div class="row">
            <table id="tableCar" class="table">
                <thead>
                <tr class="active">
                    <th>
                        <input type="checkbox" class="check checkAll"/> 全选
                    </th>
                    <th>商品</th>
                    <th>单价</th>
                    <th>数量</th>
                    <th>小计</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>

                {notempty name='goodsList'}
                {volist name='goodsList' id='vo'}
                <tr>
                    <td class="choose">
                        <input type="checkbox" class="check"/>
                    </td>
                    <td class="commodity">
                        <img src="{$vo.goodsInfo.img_ids|get_picture_url}" width="70" height="70"/>
                        <span>{$vo.goodsInfo.name}</span>
                    </td>
                    <td class="price" style="text-decoration: initial">{$vo.goodsInfo.price}</td>
                    <td class="number">
                        <span class="reduce">-</span>
                        <input type="text" value="{$vo.num}"/>
                        <span class="add">+</span>
                    </td>
                    <td class="total">{$vo.num*$vo.goodsInfo.price}</td>
                    <td class="remove">
                        <input type="text" hidden value="{$vo.id}" class="product_id">
                        <span class="delete">删除</span>
                    </td>
                </tr>
                {/volist}
                {/notempty}
                {empty name='goodsList'}
                <tr style="text-align: center">
                    <td>
                        无
                    </td>
                </tr>
                {/empty}
                </tbody>
            </table>
            <div>
                {notempty name='goodsList'}
                <lable>
                    <span>收货地址：</span>
                </lable>
                <div>
                    <tbody id="tb">
                    {volist name="address_list" id="vo"}
                        <tr>
                            <td>
                                <input  class="address_id" name="testCheckBox" type="checkbox" value="{$vo.id}" >
                            </td>
                            <td>
                                <span>收货人：{$vo.take_user}</span>
                            </td>
                            <td>
                                <span>收货电话：{$vo.phone}</span>
                            </td>
                            <td>
                                <span>收货地址：{$vo.provence}{$vo.city}{$vo.country}{$vo.detail}</span>
                            </td>
                            <td></td>
                        </tr> <br/>
                    {/volist}
                    </tbody>
                    {/notempty}
                </div>
            </div>
        </div>
        <div class="row aggregate">
            <div class="col-lg-1">
                <input type="checkbox" class="check checkAll"/><label>全选</label>
            </div>
            <div class="col-lg-2">
                <span id="deleteSelect">删除选中商品</span>
            </div>
            <div class="col-lg-2 col-lg-offset-4">
                已选商品<span id="selectTotal">0</span>件
            </div>
            <div class="col-lg-2">
                总计：￥<span id="priceTotal">0</span>
            </div>
            <div class="col-lg-1">
                <a class="btn btn-primary">结算</a>
            </div>
        </div>

    </div>



    <!--底部-->
    <footer class="cancelBg">
        <div class="footerBg"></div>
        <div class="footer">
            <div class="container">
                <div class="row">
                    <div class="col-lg-3">
                        <img src="__STATIC__/shopCar/images/footer11.png"/>
                    </div>
                    <div class="col-lg-3">
                        <img src="__STATIC__/shopCar/images/footer22.png"/>
                    </div>
                    <div class="col-lg-3">
                        <img src="__STATIC__/shopCar/images/footer33.png"/>
                    </div>
                    <div class="col-lg-3">
                        <img src="__STATIC__/shopCar/images/footer44.png"/>
                    </div>
                </div>
                <div class="row footerInfor">
                    <div class="col-lg-2">
                        <img src="__STATIC__/shopCar/images/erweima.png"/>
                        <p>扫描关注APP</p>
                    </div>
                    <div class="col-lg-2">
                        <h4>购物指南</h4>
                        <a>购物流程</a>
                        <a>售后政策</a>
                        <a>支付方式</a>
                    </div>
                    <div class="col-lg-2">
                        <h4>支付方式</h4>
                        <a>安全支付保障</a>
                        <a>在线支付</a>
                        <a>支付宝支付</a>
                    </div>
                    <div class="col-lg-2">
                        <h4>售后服务</h4>
                        <a>退换货流程</a>
                        <a>退款流程</a>
                        <a>取消订单</a>
                    </div>
                    <div class="col-lg-2">
                        <h4>公司简介</h4>
                        <a>关于我们</a>
                        <a>联系我们</a>
                        <a>邮箱反馈</a>
                    </div>
                </div>
                <div class="row footerLink">
                    <div>
                        <a>商城首页</a> |
                        <a>关于商城</a> |
                        <a>联系我们</a> |
                        <a>帮助中心</a>
                        <p>Copyright © 2004-2017 alinejun版权所有</p>
                    </div>
                </div>
            </div>
        </div>
    </footer>


</div>
<script>
    $("input[name='testCheckBox']").on('click', function(){
        // 取消全部checkbox的选中
        $("input[name='testCheckBox']").prop("checked", false);
        // 设置选中当前
        $(this).prop("checked", true);
    });
    $('.btn-primary').click(
        function(){
              var num = $('#selectTotal').html();
              var price = $('#priceTotal').html();

              if(num==0){
                alert('请选择一件商品');return ;
              }
              var url = '{:url("/index/order/create")}'
              var address_id = $('input[name="testCheckBox"]:checked').val()
              selectCar= getShopId();
              $.post(url,{carid:selectCar,address_id:address_id},function (e) {
                  console.log(e)
                  if(e.code==1){
                      alert(e.msg);
                      window.location.href = e.data.url;
                  }else{
                      alert(e.msg);
                      window.location.href = e.data;
                  }
              },'json')
          }
    );
    function getShopId(){
        var table = document.getElementById('tableCar');
        var tr = table.children[1].rows;
        //定义总价
        var prices = 0;
        //定义数量
        var selected = [];

        for(var i=0,len =tr.length;i<len;i++)
        {
            //第一步判断勾选框是不是选中，选中就计算数量和总价
            if(tr[i].getElementsByTagName("input")[0].checked)
            {
                selected.push(parseInt(tr[i].getElementsByTagName("input")[2].value));
            }
        }
        return selected;
    }
</script>
<!--jquery 文件-->
<script type="text/javascript" src="__STATIC__/shopCar/jquery/jquery-3.0.0.min.js" ></script>
<script type="text/javascript" src="__STATIC__/shopCar/js/base.js" ></script>
<script type="text/javascript" src="__STATIC__/shopCar/js/shopCar.js" ></script>
</body>
</html>
